<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/index.js"></script>
</head>

<body>
    <!-- 最顶部制作 -->
    <header>
        <div class="w1">
            <a href="#" class="qqvipicon"></a>
            <div class="shortcut">
                <div class="fl">
                    <ul>
                        <li><a href="#">首页</a></li>
                        <li><a href="#">成长体系</a></li>
                        <li><a href="#">特权与功能</a></li>
                        <li><a href="#">会员活动</a></li>
                        <li><a href="#">徽章馆</a></li>
                        <li><a href="#">营业厅</a></li>
                    </ul>
                </div>
                <div class="fr">
                    <ul>
                        <li><a href="#">QQ特权频道</a></li>
                        <li><a href="#">游戏特权频道</a></li>
                        <li><a href="#">生活特权频道</a></li>
                        <li><a href="#">购物特权频道</a></li>
                    </ul>
                </div>
            </div>
            <div class="log">
                欢迎您，月
                <a href="#">个人中心</a>
                <a href="#">退出</a>
                <a href="#"><img src="images/newvip.png" alt=""></a>
            </div>
        </div>


    </header>
    <!-- 活动图案制作 -->
    <div class="active">
        <div class="w1">
            <img class="logo" src="images/logo.png" alt="">
            <img class="vip" src="images/vip.png" alt="">
            <img class="rebtn" src="images/rebtn.png" alt="">
        </div>
    </div>
    <!-- part1制作 -->
    <div class="part1">
        <div class="w1">
            <div class="part1-icon"></div>
            <div class="w2">
                <div class="context">
                    <h2>报名参赛 挑战极限</h2>
                    <p>在活动时间2014年X月XX日—X月XX日，报名个人赛玩家可获得<em>参赛礼包</em>一份，QQ会员玩家报名还可额外获得<em>会员礼包</em>。</p>
                </div>
                <div class="joininfo">
                    <div class="joinbtn">
                        <img src="images/joinbtn.png" alt="">
                    </div>
                    <i>已有 <em>144469</em> 人参加巡回赛</i>
                </div>
                <div class="box">
                    <div class="box1">
                        <h3></h3>
                        <div class="box1-gift">
                            <img src="upload/joingift.png" alt="">
                        </div>
                        <img class="giftimg" src="images/giftbtn.png" alt="">
                    </div>
                    <div class="box2">
                        <h3></h3>
                        <div class="box2-gift">
                            <img src="upload/vipgift.png" alt="">
                        </div>
                        <img class="giftimg" src="images/giftbtn.png" alt="">
                        <a href="#">查看我的礼包&gt;&gt;</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- part2制作 -->
    <div class="part2">
        <div class="w1">
            <div class="part2-icon"></div>
            <div class="w2">
                <div class="context">
                    <h2>超级会员 好礼先有</h2>
                    <p>活动期间，在本页面1次性开通1个月及以上超级会员，即可领取<em>会员专属大礼包</em>一份，先到先得领完即止。</p>
                    <img class="newvip2" src="images/newvip2.png" alt="">
                </div>
                <div class="gift">
                    <img class="giftbtn" src="images/giftbtn.png" alt="">
                    <img class="part2-gift" src="upload/part2-gift.png" alt="">
                    <img class="add" src="images/add.png" alt="">
                    <div class="addgift">
                        <ul>
                            <li><img src="upload/part2-gift1.png" alt=""></li>
                            <li><img src="upload/part2-gift2.png" alt=""></li>
                            <li><img src="upload/part2-gift3.png" alt=""></li>
                            <li><img src="upload/part2-gift4.png" alt=""></li>
                        </ul>
                        <div class="shape">4得其一</div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- part3制作 -->
    <div class="part3">
        <div class="w1">
            <div class="part3-icon"></div>
            <div class="w2">
                <div class="context">
                    <h2>分享好友 道具先有</h2>
                    <p>活动期间，用户每天可微波传递本活动信息，转播成功后获得1次抽奖机会，QQ会员多1次。</p>
                </div>
                <div class="share">
                    <div class="fl">
                        <div class="context">
                            逆战巡回赛即将开赛！赶快邀好友共睹巅峰决战，<br>
                            更有超值道具等你拿哟！<br>
                            活动地址：xxxxxxxxxxxxxxxxxxxxx
                        </div>
                        <img class="sendbtn" src="images/sendbtn.png" alt="">
                        <div class="check">
                            <input type="checkbox" name="" id="" checked="checked">
                            <i>同时收听QQ飞车、QQ会员游戏特权微博</i></div>
                    </div>
                    <div class="fr">
                        <a href="#">查看我的抽奖机会&gt;&gt;</a>
                        <ol id='ols'>
                            <li><img src="upload/goods1.png" alt=""></li>
                            <li><img src="upload/goods2.png" alt=""></li>
                            <li><img src="upload/goods3.png" alt=""></li>
                            <li><img src="upload/goods4.png" alt=""></li>
                            <li id='choicebtn'></li>
                            <li><img src="upload/goods5.png" alt=""></li>
                            <li><img src="upload/goods6.png" alt=""></li>
                            <li><img src="upload/goods7.png" alt=""></li>
                            <li><img src="upload/goods8.png" alt=""></li>
                        </ol>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 底部规则制作 -->
    <div class="rules">
        <div class="w1">
            <div class="w2">
                <h2>活动规则</h2>
                <ul>
                    <li>
                        <div class="num">1</div>
                        <p>活动规则活动规则活动规则活动规则活动规则活动规则</p>
                    </li>
                    <li>
                        <div class="num">2</div>
                        <p>活动规则活动规则活动规则活动规则活动规则活动规则活动规则活动规则活动规则活动规则活动规则活动规则</p>
                    </li>
                    <li>
                        <div class="num">3</div>
                        <p>活动规则活动规则活动规则活动规则活动规则活动规则</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 底部声明 -->
    <footer>
        <p><a href="#">关于腾讯</a> | <a href="#">About Tencent</a> |<a href="#">服务条款</a> |<a href="#">广告服务</a> |<a
                href="#">腾讯招聘</a> | <a href="#">客服中心</a> | <a href="#">网站导航</a> |<br>
            Copyright © 1998 - 2011 Tencent. All Rights Reserved.<br>
            腾讯公司 版权所有</p>
    </footer>
</body>

</html>